<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>waiter</title>
    <style>
        * {
            box-sizing: border-box;
        }

        body a:hover{
            text-decoration:none;
        }

        body a{
           color:white;
        }


        .foot ul li {
            margin: 20px;
            display: block;
            float: left;
            list-style: center;

        }

        /* #index1 {
            height: 400px;
            background: url(../../imgs/index5.png) no-repeat;
            background-size: 100% 100%;
        } */

        #index2 img {
            margin-left: 30px;
            margin-top: 60px;
            width: 100px;
            height: 100px;

        }

        #index3 {
            width: 50%;
            height: 500px;
            background: url(../../imgs/index127.jpg);
            
            float: left;
        }

        #index3 p {
            margin-left: 25%;
            padding: 10px;
        }

        #index4 {
            width: 50%;
            height: 500px;
            background: url(../../imgs/index127.jpg);
            float: right;
        }

        #work {
            width: 200px;
            height: 30px;
        }

        #index41 p{
            padding: 15px 15px 15px 25px;
            
        }

        


        #header {
            height: 200px;
            border: 1px solid#e2e2e2;
        }
    </style>

    <!-- 引入bootstrap框架的样式文件 -->
    <link rel="stylesheet" href="../../plugins/bootstrap/css/bootstrap.css" type="text/css">
    <link rel="stylesheet" href="../../https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
</head>

<body>


    <!-- <div id="index1">
        <p style="font-size: 30px;color:white;padding-left:60%;padding-top:150px;">闲时邀你,体面赚钱</p>
        <p style="font-size: 20px;color:white;padding-left:60%;padding-top:10px;">订单多，收入高钱</p>
    </div> -->

    <div id="header">


        </div>


    <div>
        <p style="font-size: 30px;padding-left:13%">服务员报名流程</p>

        <div id="index2">
            <div class="col-md-4" style="padding-left:13%;">
                <div
                    style="margin-left:20px;background-color: blue;width:50px;height:60px;position: relative;z-index: 8;margin-bottom: -30px;">
                    <p style="font-size: 30px;color:white;padding:10px;">
                        01
                    </p>
                </div>
                <div class="thumbnail" style="width:300px;height:200px;">
                    <div class="media">
                        <div class="media-left media-top">
                            <img src="../../imgs/indexer.jpg" class="media-object">
                        </div>
                        <div class="media-body" style="padding-top:60px;">
                            <p style="font-size: 20px;">第一步</p>
                            <p>扫描二维码下载“闪送员”App(请使用安卓手机下载</p>
                        </div>

                    </div>
                </div>
            </div>
            <div class="col-md-4">
                <div
                    style="margin-left:100px;background-color: blue;width:50px;height:60px;position: relative;z-index: 8;margin-bottom: -30px;">
                    <p style="font-size: 30px;color:white;padding:10px;">
                        02
                    </p>
                </div>
                <div class="thumbnail" style="margin-left:20%;width:300px;height:200px;">
                    <div class="media">
                        <div class="media-left media-top">
                            <img src="../../imgs/indexer2.jpg" class="media-object">
                        </div>
                        <div class="media-body" style="padding-top:60px;">
                            <p style="font-size: 20px;">第二步</p>
                            <p>在App里报名并上传证件资料</p>
                        </div>
                    </div>

                </div>
            </div>

            <div class="col-md-4">
                <div
                    style="margin-left:20px;background-color: blue;width:50px;height:60px;position: relative;z-index: 8;margin-bottom: -30px;">
                    <p style="font-size: 30px;color:white;padding:10px;">
                        03
                    </p>
                </div>
                <div class="thumbnail" style="width:300px;height:200px;">
                    <div class="media">
                        <div class="media-left media-top">
                            <img src="../../imgs/indexer3.jpg" class="media-object">
                        </div>
                        <div class="media-body" style="padding-top:60px;">
                            <p style="font-size: 20px;">第三步</p>
                            <p>前往站点培训获得信息卡后开始接单</p>
                        </div>
                    </div>

                </div>
            </div>

        </div>
    </div>



    <div>
        <div id="index3">
            <div class="c-b-center">
                <dl class="c-technological">
                    <dt>
                        <h3 style="margin-left:25%;padding-top:20px;">闪送员招募条件</h3>
                    </dt>
                    <p>年龄：18岁至55岁（男），18岁至45岁（女）</p>
                    <p>具有支持GPS功能的安卓手机</p>
                    <p>有汽车、电动车或者摩托车优先</p>
                    <p>具有良好的服务意识</p>
                    <p>有过快递、跑腿、鲜花、外卖配送经验者优先</p>
                    <p>工作时需要随身携带能够放下A4纸大小文件的包，面试时必须携带</p>
                    <p>退伍军人、先进工作者及劳动模范优先</p>
                </dl>
            </div>
        </div>



<!-- 右边 -->
        <div id="index4">
                <div id="index41">

                        <h2 style="text-align:center;">基本信息</h2>
            <p>服务领域:&nbsp; &nbsp;&nbsp;
                <select id="work" class="form-control" style="margin:-30px 0 0 80px;height:40px;">
                    <option value="-1">锻炼身体/出游陪玩</option>
                    <option value="-1">看护小孩/照顾老人</option>
                    <option value="-1">谈心聊天/网络游戏</option>
                </select>
                <!-- <p style="margin:-70px 0 0 32%;">确认服务领域后，只能在该领域选择</p> -->


            </p>


            <div id="waiter4" style="padding-left:25px;margin-bottom: 20px;">

                <form class="form-inline">

                    <div data-toggle="distpicker">
                        <div class="form-group">
                            所在地：&nbsp; &nbsp;&nbsp;<label class="sr-only" for="province1">Province</label>
                            <select class="form-control" id="province1"></select>
                        </div>
                        <div class="form-group">&nbsp; &nbsp;&nbsp;
                            <label class="sr-only" for="city1">City</label>
                            <select class="form-control" id="city1"></select>
                        </div>
                        <div class="form-group">&nbsp; &nbsp;&nbsp;
                            <label class="sr-only" for="district1">District</label>
                            <select class="form-control" id="district1"></select>
                        </div>
                    </div>
                </form>

            </div>

            <p>工作经验:&nbsp; &nbsp;&nbsp;
                <select id="work">
                    <option value="-1">请选择</option>
                    <option value="-1">一年以内</option>
                    <option value="-1">一到三年</option>
                    <option value="-1">三年以上</option>
                </select>
            </p>

            <p>工作现状:&nbsp; &nbsp;&nbsp;
                <select id="work" class="form-control" style="margin:-30px 0 0 80px;height:40px;">
                    <option value="-1">自由状态</option>
                    <option value="-1">暂无工作</option>
                    <option value="-1">有工作</option>
                </select>
            </p>
            <p>最大项目:&nbsp; &nbsp;&nbsp;
                <select id="work" class="form-control" style="margin:-30px 0 0 80px;height:40px;">
                    <option value="-1">100元以内</option>
                    <option value="-1">100元到1000元</option>
                    <option value="-1">1000元以上</option>
                </select>
            </p>
            <p>最大项目:&nbsp; &nbsp;&nbsp;
                <button>职业标签</button>&nbsp; &nbsp;&nbsp;
                <button>+</button>
                &nbsp; &nbsp;&nbsp;在已选的项目中最多选择3个职业标签
            </p>

            <span><button style="margin-left:40%;">提交</button>&nbsp; &nbsp;&nbsp;
                <button>取消</button></span>


        </div>
    </div>
















    </div>

    <div>

        <div class="foot" style=" background-color:rgb(51, 51, 51);margin-top:710px;height: 250px;">
            <div style="margin-left:580px; padding-top:60px;">
                <img src="imgs/51.png" alt="" style="width:50px;height:50px;">
                <img src="imgs/52.png" alt="" style="width:50px;height:50px;margin-left:30px;">
            </div>
            <ul style="list-style: none;margin-left:380px;">
                <li><a href="#">成为员工</a></li>
                <li><a href="#">成为合作商户</a></li>
                <li><a href="#">常见问题</a></li>
                <li><a href="#">关于我们</a></li>
            </ul>
            <p style="padding-top:50px;padding-left:400px;color:white;">
                <a href="//cdn.ishansong.com/iss-new-pc/images/bigImg/license.jpg" rel="noreferrer noopener"
                    class="license" target="_blank">营业执照&nbsp;&nbsp;</a>
                <a href="#">电话 400 612 6688&nbsp;&nbsp; </a><a class="mr20" href="mailto:info@ishansong.com">企业邮箱 info@ishansong.com&nbsp;&nbsp;</a>
                <a href="mailto:lzjb@ishansong.com" class="mr20">廉正举报邮箱 &nbsp;&nbsp;lzjb@ishansong.com&nbsp;&nbsp;</a>
            </p>



            <p style="padding-left:370px;"><span>2014 京ICP备14006546号-4.</span><a rel="noreferrer noopener"
                    target="_blank"
                    href="http://www.beian.gov.cn/portal/registerSystemInfo?COLLCC=889263189&amp;recordcode=11010802020241"><img
                        src="">
                    京公网安备 11010802020241号</a>
            </p>
        </div>

    </div>




    <!-- bootstrap中的js插件依赖于jquery框架,所以必须先引入jquery的js文件 -->
    <script src="../../plugins/jquery/jquery.min.js"></script>
    <!--引入bootstrap的js文件-->
    <script src="../../plugins/bootstrap/js/bootstrap.js"></script>

    <script src="../../plugins/bootstrap-date/js/distpicker.data.js"></script>
    <script src="../../plugins/bootstrap-date/js/distpicker.js"></script>
    <script src="../../plugins/bootstrap-date/js/main.js"></script>
    <script src="../../https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
    <script src="../../https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>



</body>

</html>